<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<!DOCTYPE html>
<html>
<head>
    <title>显示详情</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="/css/officialDocument/officialDocument.css">

    <link rel="stylesheet" href="/lib/layer/skin/default/layer.css">
    <link type="text/css" rel="stylesheet" href="/lib/pagination/style/pagination.css">
    <link rel="stylesheet" href="/css/base/base.css?20201106.1">

    <link rel="stylesheet" type="text/css" href="/lib/layui/layui/css/layui.css"/>
    <script type="text/javascript" src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/layui.all.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js"></script>

    <script src="/js/common/language.js"></script>

    <script type="text/javascript" src="/js/jquery/jquery-1.9.1.js"></script>
    <script src="/js/jquery/jquery.cookie.js"></script>
    <script type="text/javascript" src="/js/base/tablePage.js"></script>
    <script src="/lib/layer/layer.js?20201106"></script>
    <script src="/js/base/base.js"></script>
    <script src="/lib/laydate/laydate.js"></script>
    <script type="text/javascript" charset="utf-8" src="/lib/pagination/js/jquery.pagination.min.js"></script>

    <%--<script src="/js/document/makeADraft.js"></script>--%>
    <link rel="stylesheet" type="text/css" href="/css/commonTheme/${sessionScope.InterfaceModel}/commonTheme.css"/>
    <style>

        body{
            overflow: hidden;
        }
        table tr {
            border-width: 1px;
            border-style: solid;
            border-color: rgb(204, 204, 204);
            border-image: initial;
        }
        table tr th {
            font-size: 17px;
            color: rgb(47, 92, 143);
            text-align: center;
            height: 28px;
            line-height: 28px;
        }

        table  td {
            font-size: 11pt;
            height: 30px;
            line-height: 30px;
            text-align: center;
            word-break: keep-all;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }
        table tr:nth-child(2n) {
            background-color: rgb(255, 255, 255);
        }
        table tr:nth-child(2n+1) {
            background-color:#F6F7F9 ;
        }
        .newLeave {
            border-radius: 3px;
            float: left;
            width: 70px;
            height: 28px;
            color: #fff;
            font-size: 14px;
            line-height: 28px;
            margin-left: 155px;
            margin-top: 14px;
            cursor: pointer;
            background: #2b7fe0
        }
        .clearfix {
            margin: 5px auto;
            width: 93%;
        }
        textarea.BigStatic {
            font-size: 10pt;
            padding: 1px 5px;
            border: 1px solid #C0BBB4;
            background: #E0E0E0;
            margin-left: 32px;
        }
        .index-desc{
            height: 95px;
            float: left;
            line-height: 95px;
            margin-right: 9px;
        }
        .lab-set{
            height: 50px;
            float: left;
            line-height: 47px;

        }
        #portalName{
            height: 30px;
            margin-right: 16px;
        }
        .li-set p{
            margin: 5px 0 0 103px;
        }
        .M-box3 .active {
            margin: 0px 3px;
            width: 38px;
            height: 38px;
            line-height: 38px;
            background: #2b7fe0;
            font-size: 12px;
            border: 1px solid #2b7fe0;
            color: #fff;
            text-align: center;
            display: inline-block;
        }
        .M-box3 {
            margin-top: 30px;
            position: fixed;
            bottom: 10px;
            right: 60px;
            text-align: center;
        }
        .M-box3 a {
            margin: 0 3px;
            width: 38px;
            height: 38px;
            line-height: 38px;
            font-size: 12px;
            display: inline-block;
            text-align: center;
            background: #fff;
            border: 1px solid #ebebeb;
            color: #333;
            text-decoration: none;
        }
        .jump-ipt {
            width: 38px;
            height: 38px;
            line-height: 38px;
            text-align: center;
            padding: 0;
        }
        #kaoList{
            margin:50px 0 0 30px;
            float:left;
            width: 130px;
        }
        #kaoList dt{
            font-size: 14px;
            height: 30px;
            line-height: 30px;
            text-align: center;
        }
        #kaoList dd{
            font-size: 13px;
            height: 26px;
            line-height: 26px;
            text-align: center;
            background-color: rgb(217, 232, 255);
        }
        #kaoList dd a{
            color: #007cfd;
        }
        #kaoheList{
            margin: 80px 0 0 20%;
            float: left;
            width: 400px;
            color: #fff;
            height: 300px;
        }
        #kaoheList p{
            font-size: 14px;
            height: 30px;
            line-height: 30px;
            background-color: #357ece;
            padding-left: 28px;
            /* margin-top: 0px; */
            position: absolute;
            width: 372px;
            border-radius: 10px 10px 0 0;
        }
        #kaoheList .info{
            background: #357ece  url("../img/sys/icon64_info.png") no-repeat 48px 36px;
            height: 134px;
            text-align: center;
            line-height: 40px;
            border-radius: 10px;
            box-shadow: 3px 3px 3px #2F5C8F;

        }
        .self_input{
            height:26px;
        }
        table tr td a {
            color: #2b7fe0;
            width: 100%;
            display: block;
        }
        #footContent{
            width: 600px;
            height:30px;
            text-align: center;
            margin-top: 10px;
            padding-left: 30px;
        }
        #footContent a{
            color: #fff;
            text-align: center;
            display: inline-block;
            height: 24px;
            width: 70px;
            line-height: 24px;
            background-color:#2b7fe0;
            border-radius: 5px;
            padding: 5px;

        }
        .headTop{
            position: inherit;
        }
        .on{
            background: #D3E7FA !important;
        }
        .explain{
            width: 32%;
            margin: 4px 10px;
        }
        .explain td{
            padding: 0;
            border: 1px solid #cccccc;
        }
        .explainleft{
            float: left;
            border: none!important;
            margin-left: 6px;
        }
        .list1 tr th{
            border: 1px solid #cccccc;
        }
        #taskBody .trTask  td{
            border: 1px solid #cccccc;
        }
        .savebtn,.back{
            border-color: #4898d5;
            background-color: #2e8ded;
            color: #fff;
            padding: 5px 15px;
            border-radius: 3px;
        }
        .cancel{
            border-color: #4898d5;
            background-color: #E6E6E6;
            color: #fff;
            padding: 5px 15px;
        }
        .layui-input-block{
            margin-left: 0px;
        }
        .trTask td{
            overflow: visible;
        }
        body{
            overflow-y: auto;
        }
        .export{
            float: right;
            width: 90px;
            height: 28px;
            background: #2b7fe0;
            color: #fff;
            font-size: 14px;
            line-height: 28px;
            margin: -4% 6% 0 0;
            cursor: pointer;
            border-radius: 3px;
        }
    </style>
</head>
<body>
<h1 style="text-align: center;font-weight: 500;margin: 5px 0" class="group_name"></h1>
<h2 style="text-align: center;font-weight: 500;margin-top:14px" class="title1">评分详情</h2>
<p style="font-size: 14px;margin: 10px 10px">评价尺度说明:</p>
<table class="explain">
    <tr>
        <td style="width: 28%">分值</td>
        <td style="text-align: center">说明</td>
    </tr>
    <tr>
        <td>优-100</td>
        <td class="explainleft">非常称职甚至超越岗位期望。</td>
    </tr>
    <tr>
        <td>良-80</td>
        <td class="explainleft">称职，能较好达到岗位期望。</td>
    </tr>
    <tr>
        <td>中-70</td>
        <td class="explainleft">称职，能达到岗位期望。</td>
    </tr>
    <tr>
        <td>合格-60</td>
        <td class="explainleft">基本称职，即基本达到岗位期望。</td>
    </tr>
    <tr>
        <td>待改善-40</td>
        <td class="explainleft">不能满足岗位需求。</td>
    </tr>
</table>
<%--<div class="export">--%>
<%--            <span style="margin-left: 18px;">--%>
<%--               导出明细--%>
<%--            </span>--%>
<%--</div>--%>
<table style="margin-left: 10px;margin-top:14px;width: 98%" id="taskBody1">
    <thead class="list1">
    </thead>
    <tbody id="taskBody">
    </tbody>


</table>
<div style="text-align:center;margin: 10px auto">
    <%--<button class="savebtn">保存</button>--%>
    <%--<button class="cancel">取消</button>--%>
    <button class="back">返回</button>
</div>
<script>
    function getQueryString(name){
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }
    var title1;
    var type = getQueryString("type");
    var flowId = getQueryString("flowId");
    var userId = getQueryString("userId");
    $.ajax({
        type:'get',
        url:'/ScoreFlowController/selPaperDetail',
        dataType:'json',
        data:{
            flowId:flowId
        },
        success:function(res){
            // title1=res.data.groupName;
            // $(".title1").text(title1)
            if(res.code==0){
                $('.group_name').text(res.data.groupName);
                var str11 = "";
                var str22 = "";
                var str33 = "";
                for(var i=0;i<res.data.groupTypes.length;i++){
                    var str1 = "";
                    var str2 = "";
                    var str3 = "";
                    if(res.data.groupTypes[i].scoreItems.length == 0){
                        str1+='<th></th>'
                        str2+='<th></th>'
                        str3='<th>'+res.data.groupTypes[i].groupName+'<br/>'+undefindNaN(res.data.groupTypes[i].weight)*100+'%'+'</th>'
                    }else{
                        for(var j=0;j<res.data.groupTypes[i].scoreItems.length;j++){
                            str1+='<th><span class="abc" style="display: none">'+res.data.groupTypes[i].scoreItems[j].itemId+'</span>'+res.data.groupTypes[i].scoreItems[j].itemName+'</th>'
                            str2+='<th>'+undefindNaN(res.data.groupTypes[i].scoreItems[j].weight)*100+'%'+'</th>'
                            if(j==0){
                                str3='<th colspan='+res.data.groupTypes[i].scoreItems.length+'>'+res.data.groupTypes[i].groupName+'<br/>'+undefindNaN(res.data.groupTypes[i].weight)*100+'%'+'</th>'
                            }else{
                                str3+='<th style="display: none"><span class="abc" style="display: none">'+res.data.groupTypes[i].scoreItems[j].itemId+'</span>'+res.data.groupTypes[i].scoreItems[j].itemName+'</th>'

                            }
                        }
                    }
                    str11 += str1;
                    str22 += str2;
                    str33 += str3;
                }
                //var s = '<tr><th rowspan="3" style="width: 42px;">ID</th><th rowspan="3" style="width: 84px">考核人</th><th rowspan="3" style="width: 84px">级别</th><th rowspan="3" style="width: 84px">总权重</th><th rowspan="3" style="width: 84px">比例</th>'+str33+'<th rowspan="3" style="width: 80px">得分</th></tr><tr><th style="display: none;width: 42px;">ID</th><th style="display: none;width: 84px">考核人</th><th rowspan="3" style="width: 84px;display: none;">级别</th><th rowspan="3" style="width: 84px;display: none;">总权重</th><th rowspan="3" style="width: 84px; display: none;">比例</th>'+str11+'<th rowspan="3" style="width: 80px;display: none">得分</th></tr><tr><th style="display: none;width: 42px">ID</th><th style="display: none;width: 84px">考核人</th><th rowspan="3" style="width: 84px;display: none;">级别</th><th rowspan="3" style="width: 84px;display: none;">总权重</th><th rowspan="3" style="width: 84px;display: none;">比例</th>'+str22+'<th rowspan="3" style="width: 80px;display: none">得分</th></tr>'
                var s = '<tr><th rowspan="3" style="width: 42px;">ID</th><th rowspan="3" style="width: 84px">考核人</th><th rowspan="3" style="width: 84px">级别</th><th rowspan="3" style="width: 84px">总权重</th><th rowspan="3" style="width: 84px">比例</th>'+'<th rowspan="3" style="width: 80px">得分</th></tr><tr><th style="display: none;width: 42px;">ID</th><th style="display: none;width: 84px">考核人</th><th rowspan="3" style="width: 84px;display: none;">级别</th><th rowspan="3" style="width: 84px;display: none;">总权重</th><th rowspan="3" style="width: 84px; display: none;">比例</th>'+ '<th rowspan="3" style="width: 80px;display: none">得分</th></tr><tr><th style="display: none;width: 42px">ID</th><th style="display: none;width: 84px">考核人</th><th rowspan="3" style="width: 84px;display: none;">级别</th><th rowspan="3" style="width: 84px;display: none;">总权重</th><th rowspan="3" style="width: 84px;display: none;">比例</th>'+'<th rowspan="3" style="width: 80px;display: none">得分</th></tr>'
                $('.list1').html(s)
                $.ajax({
                    type:'post',
                    url:'/scoreFlowUser/selUserScoreDetail',
                    dataType:'json',
                    data:{
                        flowId:flowId,
                        userId:userId
                    },
                    success:function(res){
                        if(res.code==0){
                            var cells = document.getElementById("taskBody1").rows.item(0).cells.length;
                            var avv="";
                            // for(var j=6;j< cells;j++) {
                            //     avv += '<td>' +
                            //         // '<form class="layui-form" action=""><div class="layui-form-item" style="margin-bottom: 0px"><div class="layui-input-block">'+
                            //         // '<select name="judge" id="judge" lay-filter="testId" lay-verify="required" onclick="fun()">' +
                            //         // // '<option value="0">请选择</option>' +
                            //         // '<option value="1">优</option>' +
                            //         // '<option value="2">良</option>' +
                            //         // '<option value="3">中</option>' +
                            //         // '<option value="4">合格</option>' +
                            //         // '<option value="5">待改善</option>' +
                            //         // '</select></div></form>' +
                            //         '<input type="text" name="scoretotal" value="0" disabled="disabled" style="border:none;background-color:none;width: 100%;height: 36px"/>'
                            //     '</td>+'
                            // }
                            var avv1=""
                            for(var j1=6;j1<cells;j1++){
                                avv1+='<td>'+'</td>'
                            }
                            var obj = res.obj;
                            var acc2="";
                            var acc3="";
                            var acc = "";
                            var arr =dataASE(res.data);
                            var a1=[];
                            var a2=[];
                            var a3=[];
                            for(var q=0;q<arr.length;q++){
                                if(arr[q].privType == 1){
                                    var o1={}
                                    o1.q = q;
                                    o1.s = arr[q].score
                                    a1.push(o1);
                                }else if(arr[q].privType == 2){
                                    var o1={}
                                    o1.q = q;
                                    o1.s = arr[q].score
                                    a2.push(o1);
                                }else if(arr[q].privType == 3){
                                    var o1={}
                                    o1.q = q;
                                    o1.s = arr[q].score
                                    a3.push(o1);
                                }
                            }
                            for(var q=0;q<arr.length;q++) {
                                acc2='<tr><td>总计</td>'+'<td></td>'+'<td></td>'+'<td></td>'+'<td></td>'+avv1+'<td>'+ undefindData(Number(res.msg).toFixed(2)) +'</td></tr>';
                                if(a1.length>0&&q == a1[0].q){
                                    var aee=0;
                                    for(var q1=0;q1<a1.length;q1++){
                                        aee+=Number(a1[q1].s);
                                    }
                                    aee=aee.toFixed(2)
                                    acc+= '<tr class="trTask">' + '<td>' + arr[q].id + '</td>'+'<td>' + arr[q].assessorName + '</td>'+'<td rowspan="'+a1.length+'">' + cha(arr[q].privType) + '</td>'+'<td rowspan="'+a1.length+'">' + arr[q].privWeight + '</td>'+'<td>' + arr[q].assessorWeight + '</td>'+'<td rowspan="'+a1.length+'">'+ undefindData(obj.first.toFixed(2))+'</td></tr>'
                                    //acc+= '<tr class="trTask">' + '<td>' + arr[q].id + '</td>'+'<td>' + arr[q].assessorName + '</td>'+'<td rowspan="'+a1.length+'">' + cha(arr[q].privType) + '</td>'+'<td rowspan="'+a1.length+'">' + arr[q].privWeight + '</td>'+'<td rowspan="'+a1.length+'">' + aee + '</td>'+avv+'<td>'+ undefindData(arr[q].assessorWeight.toFixed(2))+'</td></tr>'
                                }else if(a2.length>0&&q == a2[0].q){
                                    var aee2=0;
                                    for(var q1=0;q1<a2.length;q1++){
                                        aee2+=Number(a2[q1].s);
                                    }
                                    aee2=aee2.toFixed(2)
                                    acc+= '<tr class="trTask">' + '<td>' + arr[q].id + '</td>'+'<td>' + arr[q].assessorName + '</td>'+'<td rowspan="'+a2.length+'">' + cha(arr[q].privType) + '</td>'+'<td rowspan="'+a2.length+'">' + arr[q].privWeight + '</td>'+'<td>' + arr[q].assessorWeight + '</td>'+'<td rowspan="'+a2.length+'">'+ undefindData(obj.second.toFixed(2)) +'</td></tr>'
                                }else if(a3.length>0&&q == a3[0].q){
                                    var aee3=0;
                                    for(var q1=0;q1<a3.length;q1++){
                                        aee3+=Number(a3[q1].s);
                                    }
                                    aee3=aee3.toFixed(2)
                                    acc+= '<tr class="trTask">' + '<td>' + arr[q].id + '</td>'+'<td>' + arr[q].assessorName + '</td>'+'<td rowspan="'+a3.length+'">' + cha(arr[q].privType) + '</td>'+'<td rowspan="'+a3.length+'">' + arr[q].privWeight + '</td>'+'<td>' + arr[q].assessorWeight + '</td>'+'<td rowspan="'+a3.length+'">'+ undefindData(obj.third.toFixed(2)) +'</td></tr>'
                                }else{
                                    acc+= '<tr class="trTask">' + '<td>' + arr[q].id + '</td>'+'<td>' + arr[q].assessorName + '</td>'+'<td style="display: none;">' + cha(arr[q].privType) + '</td>'+'<td style="display: none;">' + arr[q].privWeight + '</td>'+'<td>' + arr[q].assessorWeight + '</td>'+'<td style="display: none;">'+ /*undefindData(arr[q].assessorWeight.toFixed(2))*/ +'</td></tr>'
                                }
                            }
                            $('#taskBody').html(acc+acc2);
                            var dataarr = []

                            for(var q=0;q<arr.length;q++) {
                                if(arr[q].scoreFlowItems.length>0){
                                    for (var q5 = 0; q5 < arr[q].scoreFlowItems.length; q5++) {
                                        dataarr.push(arr[q].scoreFlowItems[q5].grade);
                                    }
                                }else{
                                    var len = $("#taskBody1 .list1").find("tr").eq(1).find("th");
                                    for(var u=0;u<len.length;u++){
                                        if($(len).eq(u).css("display") == "none"){
                                        }else{
                                            dataarr.push("");
                                        }
                                    }
                                }
                            }
                            for(var m = 0;m<dataarr.length;m++){
                                var mineSelparentTyepNo = $("#taskBody tr td").find("input[name=scoretotal]");
                                $.each(mineSelparentTyepNo, function (index, item) {
                                    if (index == m) $(item).attr('value', dataarr[m]);
                                    // if (index == q1) $(item).find('option[value="'+tran(res.data[q].scoreFlowItems[q1].grade)+'"]').prop('selected', 'selected');
                                });
                            }
                        }else{
                            layer.msg("暂无数据", {icon: 2})
                        }
                    }
                })
            }else{
                layer.msg("暂无数据", {icon: 2})
            }
        }
    })
    //  返回
    $(document).on('click', '.back', function () {
        location.href="/scoreFlowUser/userList?flowId="+flowId+'&type='+type
    })
    //  取消
    $(document).on('click', '.cancel', function () {
        location.href="/scoreFlowUser/userList?flowId="+flowId
    })
    function fun(){
        //获取被选中的option标签
        var vs = $("#taskBody tr td").find("select option:selected").val()
    }
    function cha(data) {
        if(data == "1"){
            return "上级";
        }else if(data == "2"){
            return "平级";
        }else if(data == "3"){
            return "下级";
        }
    }
    function tran(data) {
        if(data == "100"){
            return "1";
        }else if(data == "80"){
            return "2";
        }else if(data == "70"){
            return "3";
        }else if(data == "60"){
            return "4";
        }else if(data == "40"){
            return "5";
        }
    }
    //处理空值
    function undefindData(data) {
        if(data == undefined){
            return '';
        }else{
            return data;
        }
    }
    //处理空值
    function undefindNaN(data) {
        undefindData(data);
        if(isNaN(data)){
            return '';
        }else{
            return data;
        }
    }
    function group(array, subGroupLength) {
        var index = 0;
        var newArray = [];
        while(index < array.length) {
            newArray.push(array.slice(index, index += subGroupLength));
        }
        return newArray;
    }
    function dataASE(data) {
        var ar1 = [];
        var ar2 = [];
        var ar3 = [];
        for(var q=0;q<data.length;q++) {
            if(data[q].privType == 1){
                ar1.push(data[q])
            }else if(data[q].privType == 2){
                ar2.push(data[q])
            }else if(data[q].privType == 3){
                ar3.push(data[q])
            }
        }
        var ar22 = ar2.concat(ar3);
        var arr = ar1.concat(ar22);
        return arr;
    }
    layui.use(['table','form'], function(){
        var table = layui.table;
        var form = layui.form;
        form.render()
    })

    //导出
    // $(document).on('click', '.export', function () {
    //     location.href='/scoreFlowUser/selFlowUsers?export=true&flowId='+flowId
    // })
</script>
</body>
</html>
